<template>
    <div class="ordinary">
        <van-sticky>
            <van-nav-bar
            :title="$route.query.title || $route.meta.title"
            v-if="!$route.meta.notNavBar"
            left-arrow
            @click-left="$router.back(-1);$router.isBack = true"
            >
            <template #right>

                <van-icon :name="$route.meta.NavBarRightIcon" size="18"
                @click="toPath"
                v-if="$route.meta.NavBarRightIcon"/>
                
                <div v-else-if="$route.meta.NavBarRightTitle"
                style="color: #1989fa;"
                @click="toPath"
                >
                    {{ $route.meta.NavBarRightTitle }}
                </div>

            </template>
            </van-nav-bar>
        </van-sticky>
        <transition :name="Version.switchTransition">
            <router-view></router-view>
        </transition>
    </div>
</template>

<script>
import { mapState, mapMutations } from 'vuex'
export default {
    components : {
    },
    computed : {
        ...mapState(['Version'])
    },
    name : 'ordinary',
    data() {
        return {
        }
    },
    created(){

    },
    methods:{
        toPath(){
            if (!this.$route.meta.NavBarRightPath) {
                return
            }
            this.$router.push(this.$route.meta.NavBarRightPath)
        },
    },
}
</script>

<style scoped>
    .ordinary{
        position: absolute;
        width: 100%;
        height: 100%;
    }
</style>